<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="./js/vue.js"></script>
    <title>Document</title>
</head>

<body>
    <div id="app"><p>{{myname}}的基础使用</p></div>
    <script>

        new Vue({

            el: "#app",
            // template: ` <p>{{myname}}的基础使用</p> `,
            data: {
                myname: "Vue",
            },
        });

        /*

        问题1：template（模板）配置选项的作用是干啥的？
        答：将模板配置选项的键值作为内容渲染到网页上的。

        问题2：什么是它的语法糖？
        答：若在vue实例化的过程中，不存在template（模板）配置选项，那么把容器中的outerHTML作为网页渲染的模板，如代码所示。（常用）

        注：outerHTML与innerHTML的区别，前者带上最外层的div#app,后者只有里面的内容，不带外层div
        
        
        
    
        */ 


    </script>
</body>

</html>